﻿<!DOCTYPE html>
<html>
  <head>
    <title>观看录播</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/观看录播/styles.css" type="text/css" rel="stylesheet"/>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/prototypePre.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/prototypePost.js"></script>
    <script src="files/观看录播/data.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- Unnamed (矩形) -->
      <div id="u3677" class="ax_default _形状">
        <img id="u3677_img" class="img " src="images/观看录播/u3677.png"/>
      </div>

      <!-- Unnamed (组合 ) -->
      <div id="u3678" class="ax_default" data-left="0" data-top="0" data-width="1458" data-height="1001">

        <!-- Unnamed (矩形) -->
        <div id="u3679" class="ax_default _形状">
          <img id="u3679_img" class="img " src="images/0-目录/u726.png"/>
        </div>

        <!-- Unnamed (水平线) -->
        <div id="u3680" class="ax_default _水平线">
          <img id="u3680_img" class="img " src="images/1_1-观看者页面/u739.png"/>
        </div>
      </div>

      <!-- Header 2 (矩形) -->
      <div id="u3681" class="ax_default _文本段落" data-label="Header 2">
        <img id="u3681_img" class="img " src="images/1_1-观看者页面/header_2_u741.png"/>
        <div id="u3681_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">4.1</span><span style="font-family:'微软雅黑 Light', '微软雅黑 Regular', '微软雅黑';font-weight:250;">.1</span><span style="font-family:'微软雅黑';font-weight:400;">-</span><span style="font-family:'微软雅黑 Light', '微软雅黑 Regular', '微软雅黑';font-weight:250;">观看录播</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3682" class="ax_default _形状">
        <img id="u3682_img" class="img " src="images/屏蔽和马赛克（马赛克暂不做）/u2045.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3683" class="ax_default _形状">
        <img id="u3683_img" class="img " src="images/观看者-流程图/u417.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3684" class="ax_default _文本段落">
        <img id="u3684_img" class="img " src="images/预约提醒/u1947.png"/>
        <div id="u3684_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">小花</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3685" class="ax_default _形状">
        <img id="u3685_img" class="img " src="images/观看者-流程图/u416.png"/>
        <div id="u3685_text" class="text ">
          <p><span style="font-family:'微软雅黑 Light', '微软雅黑 Regular', '微软雅黑';font-weight:250;">返回</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3686" class="ax_default _文本段落">
        <img id="u3686_img" class="img " src="images/观看录播/u3686.png"/>
        <div id="u3686_text" class="text ">
          <p style="font-size:18px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;">录播界面布局</span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;"><br></span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;">录播界面：</span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑';font-weight:400;">1，录播界面按照直播的时间顺序展示用户进入，点赞，回复</span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑';font-weight:400;">2，录播界面支持暂停和快进</span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p style="font-size:13px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;">录播信息</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3687" class="ax_default _文本段落">
        <img id="u3687_img" class="img " src="images/观看录播/u3687.png"/>
        <div id="u3687_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">展示用户名和回放icon</span></p>
        </div>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3688" class="ax_default _形状">
        <img id="u3688_img" class="img " src="images/观看录播/u3688.png"/>
      </div>

      <!-- Unnamed (向右三角形) -->
      <div id="u3689" class="ax_default _形状">
        <img id="u3689_img" class="img " src="images/观看录播/u3689.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3690" class="ax_default _形状">
        <img id="u3690_img" class="img " src="images/观看录播/u3690.png"/>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3691" class="ax_default _形状">
        <img id="u3691_img" class="img " src="images/观看录播/u3691.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3692" class="ax_default _文本段落">
        <img id="u3692_img" class="img " src="images/1_1-观看者页面/u818.png"/>
        <div id="u3692_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">00：12：12/00：34：00</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3693" class="ax_default _文本段落">
        <img id="u3693_img" class="img " src="images/观看录播/u3693.png"/>
        <div id="u3693_text" class="text ">
          <p><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;">控制界面：</span></p><p><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p><span style="font-family:'微软雅黑';font-weight:400;">1，点击暂停按钮可暂停当前视频</span></p><p><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p><span style="font-family:'微软雅黑';font-weight:400;">2，拖动进度条可调整当前播放进度</span></p><p><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p><span style="font-family:'微软雅黑';font-weight:400;">3，控制界面不可隐藏</span></p><p><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p><span style="font-family:'微软雅黑';font-weight:400;">4，回复支持滚动翻看</span></p><p><span style="font-family:'微软雅黑';font-weight:400;"><br></span></p><p><span style="font-family:'微软雅黑';font-weight:400;">5，支持右滑清屏（类似直播）</span></p>
        </div>
      </div>

      <!-- Header 2 (矩形) -->
      <div id="u3694" class="ax_default _文本段落" data-label="Header 2">
        <img id="u3694_img" class="img " src="images/1_1-观看者页面/header_2_u782.png"/>
        <div id="u3694_text" class="text ">
          <p><span style="font-family:'微软雅黑 Light', '微软雅黑 Regular', '微软雅黑';font-weight:250;">说明：</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3695" class="ax_default _文本段落">
        <img id="u3695_img" class="img " src="images/节目信息（暂不做）/u1155.png"/>
        <div id="u3695_text" class="text ">
          <p style="font-size:36px;"><span style="font-family:'微软雅黑 Oblique', '微软雅黑 Regular', '微软雅黑';font-style:oblique;font-size:56px;color:#000000;">49</span><span style="font-family:'微软雅黑 Oblique', '微软雅黑 Regular', '微软雅黑';font-style:oblique;"> </span><span style="font-family:'微软雅黑 Oblique', '微软雅黑 Regular', '微软雅黑';font-style:oblique;color:#999999;">/ 61</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3696" class="ax_default _形状">
        <img id="u3696_img" class="img " src="images/观看者-流程图/u416.png"/>
        <div id="u3696_text" class="text ">
          <p><span style="font-family:'微软雅黑 Light', '微软雅黑 Regular', '微软雅黑';font-weight:250;">分享</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3697" class="ax_default _形状">
        <img id="u3697_img" class="img " src="images/观看者-流程图/u428.png"/>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3698" class="ax_default _形状">
        <img id="u3698_img" class="img " src="images/观看者-流程图/u429.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3699" class="ax_default _文本段落">
        <img id="u3699_img" class="img " src="images/观看者-流程图/u430.png"/>
        <div id="u3699_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">林宥嘉：</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3700" class="ax_default _文本段落">
        <img id="u3700_img" class="img " src="images/观看者-流程图/u431.png"/>
        <div id="u3700_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">真棒，可以在跳的高一点吗</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3701" class="ax_default _形状">
        <img id="u3701_img" class="img " src="images/观看者-流程图/u432.png"/>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3702" class="ax_default _形状">
        <img id="u3702_img" class="img " src="images/观看者-流程图/u429.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3703" class="ax_default _文本段落">
        <img id="u3703_img" class="img " src="images/观看者-流程图/u430.png"/>
        <div id="u3703_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">林宥嘉：</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3704" class="ax_default _文本段落">
        <img id="u3704_img" class="img " src="images/观看者-流程图/u431.png"/>
        <div id="u3704_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">真棒，可以在跳的高一点吗</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3705" class="ax_default _形状">
        <img id="u3705_img" class="img " src="images/观看者-流程图/u436.png"/>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3706" class="ax_default _形状">
        <img id="u3706_img" class="img " src="images/观看者-流程图/u429.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3707" class="ax_default _文本段落">
        <img id="u3707_img" class="img " src="images/观看者-流程图/u430.png"/>
        <div id="u3707_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">林宥嘉：</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3708" class="ax_default _文本段落">
        <img id="u3708_img" class="img " src="images/观看者-流程图/u431.png"/>
        <div id="u3708_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">真棒，可以在跳的高一点吗</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3709" class="ax_default _形状">
        <img id="u3709_img" class="img " src="images/观看者-流程图/u444.png"/>
        <div id="u3709_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">花</span></p><p><span style="font-family:'微软雅黑';font-weight:400;">12k</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3710" class="ax_default _形状">
        <img id="u3710_img" class="img " src="images/观看者-流程图/u447.png"/>
      </div>

      <!-- Unnamed (椭圆形) -->
      <div id="u3711" class="ax_default _形状">
        <img id="u3711_img" class="img " src="images/观看者-流程图/u429.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3712" class="ax_default _文本段落">
        <img id="u3712_img" class="img " src="images/观看者-流程图/u430.png"/>
        <div id="u3712_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">林宥嘉：</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3713" class="ax_default _文本段落">
        <img id="u3713_img" class="img " src="images/观看者-流程图/u450.png"/>
        <div id="u3713_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">13“00&nbsp; 点击播放</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3714" class="ax_default _形状">
        <img id="u3714_img" class="img " src="images/观看者-流程图/u451.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3715" class="ax_default _文本段落">
        <img id="u3715_img" class="img " src="images/观看者-流程图/u452.png"/>
        <div id="u3715_text" class="text ">
          <p style="font-size:11px;"><span style="font-family:'微软雅黑';font-weight:400;font-size:13px;">林宥嘉Mr.Lin&nbsp;&nbsp; </span><span style="font-family:'微软雅黑';font-weight:400;">&nbsp; 加入直播</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3716" class="ax_default _形状">
        <img id="u3716_img" class="img " src="images/观看者-流程图/u444.png"/>
        <div id="u3716_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">123</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3717" class="ax_default _形状">
        <img id="u3717_img" class="img " src="images/观看者-流程图/u440.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3718" class="ax_default _形状">
        <img id="u3718_img" class="img " src="images/观看者-流程图/u440.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3719" class="ax_default _形状">
        <img id="u3719_img" class="img " src="images/观看者-流程图/u440.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3720" class="ax_default _形状">
        <img id="u3720_img" class="img " src="images/观看者-流程图/u440.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3721" class="ax_default _形状">
        <img id="u3721_img" class="img " src="images/观看者-流程图/u440.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3722" class="ax_default _形状">
        <img id="u3722_img" class="img " src="images/观看录播/u3722.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3723" class="ax_default _文本段落">
        <img id="u3723_img" class="img " src="images/预约提醒/u1947.png"/>
        <div id="u3723_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">回放</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3724" class="ax_default _形状">
        <img id="u3724_img" class="img " src="images/观看者-流程图/u417.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3725" class="ax_default _文本段落">
        <img id="u3725_img" class="img " src="images/预约提醒/u1947.png"/>
        <div id="u3725_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">小花</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3726" class="ax_default _形状">
        <img id="u3726_img" class="img " src="images/观看录播/u3722.png"/>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3727" class="ax_default _文本段落">
        <img id="u3727_img" class="img " src="images/预约提醒/u1947.png"/>
        <div id="u3727_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">回放</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3728" class="ax_default _形状">
        <img id="u3728_img" class="img " src="images/观看录播/u3728.png"/>
        <div id="u3728_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">清屏互动</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3729" class="ax_default _形状">
        <img id="u3729_img" class="img " src="images/观看者-流程图/u424.png"/>
        <div id="u3729_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">您当前处于非wifi继续观看会耗费流量</span></p>
        </div>
      </div>

      <!-- Unnamed (矩形) -->
      <div id="u3730" class="ax_default _文本段落">
        <img id="u3730_img" class="img " src="images/1_1-观看者页面/u822.png"/>
        <div id="u3730_text" class="text ">
          <p><span style="font-family:'微软雅黑';font-weight:400;">如果用户在非wifi</span></p><p><span style="font-family:'微软雅黑';font-weight:400;">环境观看视频，此处给出toast提示，提示2秒</span></p>
        </div>
      </div>
    </div>
  </body>
</html>
